import React, { useEffect, useState } from 'react'
import { Button, Checkbox, Form, Input } from 'antd';
import { useDispatch } from 'react-redux';

type Props = {
    name:string,
    search:any,
    resetting:any
}

const ComSearch = (props: Props) => {
    const [name,setName] = useState("")
    useEffect(()=>{
        setName(props.name)
    },[])
    const onFinish = (values: any) => {
        console.log('Success:', values);
        props.search(values)
    };

    const resetBtn = () =>{
        props.resetting(true)
    }

    const onFinishFailed = (errorInfo: any) => {
        console.log('Failed:', errorInfo);
    };
    return (
        <div style={{width:'100%'}}>
            <Form
                name="basic"
                onFinish={onFinish}
                onFinishFailed={onFinishFailed}
                autoComplete="off"
                style={{display:'flex',justifyContent:'space-between'}}
            >
                <Form.Item
                    label={name}
                    name="name"
                >
                    <Input />
                </Form.Item>

                <Form.Item style={{display:'flex'}}>
                    <Button type="primary" htmlType="submit" style={{marginRight:'10px'}}>
                        搜索
                    </Button>
                    <Button htmlType="button" onClick={resetBtn}>
                        重置
                    </Button>
                </Form.Item>
            </Form>
        </div>
    )
}

export default ComSearch